import "./index.css";
import { useState } from "react";

type nAndS = string | number

function ButtonChild({nowShowVal}: {nowShowVal:string | number}) {
  const [nowShowText, setNowShowText] = useState('')
  function changeNowShowText() {
    setNowShowText('X')
  }
  return (
    <>
      <div onClick={changeNowShowText}>{nowShowText}</div>
    </>
  );
}

export default function Game() {
  const [nextPlay, setNextPlay] = useState("X");
  const [nowStep, setNowStep] = useState(0)
  const [historyArr, SetHistoryArr] = useState(new Array<string|number>(9).fill(''))
  console.log(historyArr)
  return (
    <>
      <div className="tip-c">Next play: {nextPlay}</div>
      <div className="game-container">
        <div className="game-line">
          <ButtonChild nowShowVal = {historyArr[0]}/>
        </div>
       
      </div>
    </>
  );
}
